/* 全局变量定义 */
[data-theme2="mevinai"] {
    --background-color: #36414c;
    --primary-color: #f48436;
    --secondary-color: #1763cf;
    --white-color: #ffffff;
    --black-color: #000000;
    --gray-color: #888;
    --page-head-height: 50px;
    --navbar-height: 50px;
    --border-color: #e3e8f1;
    --bg-color: #f2f5fa;
    --scroll-bg: #565454;
    --scroll-color: #d9dfe6;
    --text-color: #333333;
    --navbar-bg-color: #ffffff;
    --navbar-text-color: #d67539;
    --search-bar-background-color: #ffffff;
    --search-bar-text-color: #1c2126;
}

[data-theme2="mevinai"][data-theme="dark"] {
    --bg-color: #1c2126;
    --border-color: #1c2126;
    --scroll-bg: #161a1f;
    --scroll-color: #aba7a6;
    --text-color: #a77e5e;
    --navbar-bg-color: #1c2126;
    --navbar-text-color: #d9dfe6;
    --sidebar-select-color: #cccccd;
    --search-bar-background-color: #302e2e;
    --search-bar-text-color: #ffffff;
    --input-background-color: #292c2f;
    --input-text-color: #ececec;
    --input-border-color: #cccccd;

    /* 深色主题下的输入框样式 */
    input,
    .form-control {
        background-color: var(--input-background-color) !important;
        color: var(--input-text-color) !important;
        border: 1px solid var(--input-border-color) !important;
    }
    
    input:focus,
    .form-control:focus {
        border-color: var(--input-border-color) !important;
    }
}

[data-theme2="mevinai"][data-theme="light"] {
    --bg-color: #f2f5fa;
    --border-color: #e3e8f1;
    --scroll-bg: #eef1f5;
    --scroll-color: #d9dfe6;
    --text-color: #333333;
    --navbar-bg-color: #fcfcfc;
    --navbar-text-color: #d67539;
    --sidebar-select-color: #b9c3d4;
    --search-bar-background-color: #ffffff;
    --search-bar-text-color: #1c2126;
}

// 全局限定
[data-theme2="mevinai"] {
    // 滚动条样式
    *::-webkit-scrollbar {
        width: 6px;
    }

    *::-webkit-scrollbar-track {
        background: var(--scroll-bg);
    }

    *::-webkit-scrollbar-thumb {
        background-color: var(--scroll-color);
        border-radius: 20px;
    }

    * {
        scrollbar-width: thin;
        scrollbar-color: var(--scroll-color) var(--scroll-bg);
    }

    // 表单和输入样式
    .awesomplete .input-with-feedback,
    .form-control,
    .comment-box .comment-input-container .ql-editor,
    .duration-picker .duration-input {
        border: 1px solid var(--border-color);
        background-color: var(--bg-color);
    }

    input,
    .form-control {
        border-radius: 0 !important;
        background-color: var(--bg-color) ;
        color: var(--text-color) !important;
        border: 1px solid var(--border-color) ;
        transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;

        &:hover,
        &:focus {
            border-color: var(--primary-color) !important;
        }

        &:focus {
            outline: none;
        }

        &::placeholder {
            color: var(--gray-color) !important;
            opacity: 0.7;
        }
    }

    // input[type="checkbox"] {
	// 	&.disabled-selected,
	// 	&:disabled:checked {
	// 		background-color: var(--gray-600);
	// 	}
	// 	&.disabled-deselected {
	// 		border: none;
	// 		background-color: var(--gray-700);
	// 	}
	// }

    // 模态框背景
    .modal-backdrop {
        background-color: #2c436b !important;
    }

    // 小部件标题和标题
    .widget .widget-head .widget-title,
    .comment-box .comment-input-header,
    .form-dashboard-section .section-head,
    .form-section .section-head,
    .head-title {
        font-size: var(--text-base);
        font-weight: 600;
    }

    // 按钮样式
    .btn-primary,
    .btn-secondary {
        color: var(--white-color) !important;
        background-color: var(--primary-color) !important;
        border-radius: 0 !important;
        transition: 0.3s;

        &:hover {
            background-color: var(--secondary-color) !important;
        }

        &:focus,
        &:active {
            box-shadow: none !important;
        }
    }

    // 页面头部
    .page-head,
    .page-head .page-head-content {
        height: var(--page-head-height);
        top: var(--page-head-height);
    }

    // 导航栏
    .navbar,
    .navbar-expand {
        background: var(--navbar-bg-color) !important;
        color: var(--navbar-text-color) !important;
        height: var(--navbar-height);
    }

    #navbar-breadcrumbs a {
        color: var(--navbar-text-color);
        text-decoration: none;

        &::before {
            font-family: FontAwesome;
            font-size: 24px;
            content: "\f105";
            margin-right: 10px;
            color: var(--navbar-text-color);
            top: 3px;
            position: relative;
        }
    }

    // 网格和表格样式
    .form-grid {
        border-radius: 0;
        border: 1px solid var(--border-color);

        .grid-heading-row {
            background-color: #f4f4f4;
            border-bottom: 1px solid var(--primary-color);
        }

        .grid-row:hover {
            background: rgba(255, 152, 0, 0.15);
        }
    }

    // 列表
    .list-subject a {
        text-decoration: none;
        transition: 0.3s;

        &:hover {
            color: var(--secondary-color);
        }
    }

    // 报表
    .datatable .dt-header .dt-cell--header .dt-cell__content {
        background-color: #f4f4f4;
    }

    // 通知
    span.notifications-seen use,
    symbol#icon-small-down {
        fill: var(--white-color);
    }

    // 按钮CSS
    .filter-button,
    .sort-selector-button,
    .btn-order {
        background-color: #cdd7d6 !important;
        color: var(--white-color) !important;
        border-radius: 0 !important;
        transition: 0.3s;

        &:hover {
            background-color: var(--primary-color) !important;
        }

        span.filter-icon {
            color: var(--white-color);

            svg.icon {
                stroke: var(--white-color);
            }
        }
    }
}
